import { defineComponent } from "vue";
import RowView from "../RowView";
import RoundImg from "../RoundImg";
import { roundInfoProps } from "./types";
import TitleView from "../TitleView";
import TextGroups from "../TextGroups";
import "./index.less";
import TextView from "../TextView";
import { Badge } from "vant";
export default defineComponent({
  name: "",
  props: roundInfoProps,
  emits: ["click"],
  setup(_, { slots, emit }) {
    return () => {
      return (
        <RowView class="!items-start" onClick={() => emit("click")}>
          <Badge content={_.badgeNum}>
            <RoundImg src={_.src} />
          </Badge>
          <div class="ml-[8px] flex-1 flex-col flex round-right ">
            <TitleView
              title={_.title}
              labels={_.labels}
              right={_.right}
              maxLength={9}
            />
            <TextGroups data={_.data} itemWidth={_.itemWidth} />
            {_.text && (
              <TextView class="mt-[6px]" limitedNumber={_.limitedNumber}>
                {_.text}
              </TextView>
            )}
            {slots.bottomLabel?.()}
          </div>
        </RowView>
      );
    };
  },
});
